import React from 'react';
import { Carousel } from 'antd-mobile';

class HomeCarousel extends React.Component {
  state = {
    data: ['', '', ''],
    initialHeight: 200,
  }

  componentDidMount() {
    // simulate img loading
    setTimeout(() => {
      this.setState({
        data: [
          {
            href: 'https://mp.weixin.qq.com/s?__biz=MzU4NTA1NDk5Ng==&mid=100003013&idx=1&sn=6f92d495856e05367f3b758d8764b091&chksm=7d9122be4ae6aba8e001d4fc6e9a202d1b90d13461c5336d179b78fdcb3ad611f3c80d597dbd&scene=0&xtrack=1#rd',
            img: require('../../assets/banner07.jpg'),
          },
          {
            href: 'https://mp.weixin.qq.com/s/chxa8UwYv4iMLW3ojZcepQ',
            img: require('../../assets/banner08.jpg'),
          },
          {
            href: 'https://mp.weixin.qq.com/s?__biz=MzU4NTA1NDk5Ng==&mid=100003703&idx=1&sn=530a48083999c4d09f5d2b746b3b4dfa&chksm=7d91210c4ae6a81aaf089c88b4f9f072eed3ebf6d4f32d9f0b8ea1bbddcd3b509f435ac9bf8d&scene=0&xtrack=1&key=906dea2828a54f8643933b5910e7f50e477551ced923f615c25c0c0fe461ac725a728d6fbf34fe4433068cb9b96f609a3b077346ba13a77604ff731552920d240c6c2cb182d42a254661c17aebd4a72a&ascene=1&uin=MzEwODg1MTU%3D&devicetype=Windows+10&version=62060739&lang=zh_CN&pass_ticket=htb82V673xQ%2BfFTvni3PQVs9IwH7%2ByC1rcZaECsv%2FvI%3D',
            img: require('../../assets/banner04.jpg'),
          },
          {
            href: 'https://mp.weixin.qq.com/s?__biz=MzU4NTA1NDk5Ng==&mid=2247487384&idx=1&sn=a6a817e6850807e5150ea2857362fa08&chksm=fd9121e3cae6a8f5da35627d06134d26ece37cedc6241c123e13e462146c6b50e10eef90337e&mpshare=1&scene=1&srcid=&key=3720f41d1a19ee78d78b99364b2461efcc58d15ae8b65f93275632785f82c227033bc22ed756206dabf3583cade750b0aa41e0d150dec91bda19a032d05f072a284abe0776aca475fefb3bd22d97d663&ascene=1&uin=MzEwODg1MTU%3D&devicetype=Windows+10&version=62060739&lang=zh_CN&pass_ticket=Wmv35Bx77D3KWeRY6jjwv%2BofA4aUtXWiIWZK7fsX5JM%3D',
            img: require('../../assets/banner09.png'),
          },
        ],
      });
    }, 100);
  }


  render() {
    // const hProp = this.state.initialHeight ? { height: this.state.initialHeight } : {};
    return (

      <Carousel
        className="my-carousel" autoplay infinite
        selectedIndex={1}
        beforeChange={(from, to) => {
        }}
        afterChange={(index) => {
        }}
      >
        {this.state.data.map(ii => (
          <a href={ii.href} key={ii} style={{ display: 'block' }}>
            <img
              style={{ width: '100%', height: '2.76rem' }}
              alt=""
              src={ii.img}
              onLoad={() => {
                this.setState({
                  initialHeight: null,
                });
              }}
            />
          </a>
        ))}
      </Carousel>

    );
  }
}

export default HomeCarousel;
